<template>
  <div class="contacts">
    <jc-form
      ref="verification"
      :option-value="contactsValue"
      :options="contactOptions"
      label-width="100px"
    />
  </div>
</template>

<script>
import jcForm from '@/components/Form'
export default {
  name: 'Index',
  components: {
    jcForm
  },
  props: {
    contactsValue: {
      type: Object,
      required: true,
      default: () => {
        return {}
      }
    },
    formDisabled: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      contactOptions: {},
      isDisabled: true
    }
  },
  watch: {
    formDisabled() {
      this.getForm()
    }
  },
  created() {
    this.getForm()
  },
  methods: {
    handleContactRef() {
      return this.$refs.verification.handleRefData()
    },
    getForm() {
      this.contactOptions = {
        fcontacts: {
          label: this.$t('market.linkman'),
          span: 8,
          disabled: this.formDisabled,
          rules: [{ required: true, message: '请输入联系人', trigger: 'blur' }]
        },
        ftels: {
          label: this.$t('market.ftels'),
          span: 8,
          disabled: this.formDisabled,
          rules: [
            { required: true, message: '请输入联系电话', trigger: 'blur' }
          ]
        },
        fmailbox: {
          label: this.$t('market.mailbox'),
          span: 8,
          disabled: this.formDisabled,
          rules: [
            {
              type: 'email',
              message: '请输入正确的邮箱地址',
              trigger: ['blur', 'change']
            }
          ]
        },
        flegalContacts: {
          label: this.$t('market.legalContacts'),
          span: 8,
          disabled: this.formDisabled,
          rules: [{ required: true, message: '请输入法人', trigger: 'blur' }]
        },
        flegalTels: {
          label: this.$t('market.legalTels'),
          span: 8,
          disabled: this.formDisabled,
          rules: [
            { required: true, message: '请输入法人电话', trigger: 'blur' }
          ]
        },
        flegalMailbox: {
          label: this.$t('market.legalMailbox'),
          span: 8,
          disabled: this.formDisabled,
          rules: [
            {
              type: 'email',
              message: '请输入正确的邮箱地址',
              trigger: ['blur', 'change']
            }
          ]
        },
        fbusinessContacts: {
          label: this.$t('market.businessContacts'),
          disabled: this.formDisabled,
          span: 8,
          rules: [
            { required: true, message: '请输入业务联系人', trigger: 'blur' }
          ]
        },
        fbusinessTels: {
          label: this.$t('market.businessTels'),
          disabled: this.formDisabled,
          span: 8,
          rules: [
            { required: true, message: '请输入业务电话', trigger: 'blur' }
          ]
        },
        fbusinessMailbox: {
          label: this.$t('market.businessMailbox'),
          span: 8,
          disabled: this.formDisabled,
          rules: [
            {
              type: 'email',
              message: '请输入正确的邮箱地址',
              trigger: ['blur', 'change']
            }
          ]
        },
        ffinanceContacts: {
          label: this.$t('market.financeContacts'),
          disabled: this.formDisabled,
          span: 8,
          rules: [
            { required: true, message: '请输入财务联系人', trigger: 'blur' }
          ]
        },
        ffinanceTels: {
          label: this.$t('market.financeTels'),
          disabled: this.formDisabled,
          span: 8,
          rules: [
            { required: true, message: '请输入财务电话', trigger: 'blur' }
          ]
        },
        ffinanceMailbox: {
          label: this.$t('market.financeMailbox'),
          span: 8,
          disabled: this.formDisabled,
          rules: [
            {
              type: 'email',
              message: '请输入正确的邮箱地址',
              trigger: ['blur', 'change']
            }
          ]
        },
        coopeartiondate: {
          label: this.$t('market.coopeartiondate'),
          type: 'date',
          span: 8,
          labelWidth: '100px',
          disabled: this.formDisabled,
          rules: [
            { required: true, message: '请选择客户合作日期', trigger: 'blur' }
          ]
        }
      }
    }
  }
}
</script>

<style scoped lang="scss">
.contacts {
  margin: 5px 0;
}
</style>
